<template>
  <div class="aa">
    <p>子组件</p>
    <span>{{ msgA }}</span><br>
    <button @click="methodAA">子传父</button><br>
    <button @click="methodAA2">子调用父方法</button>
    <aaa v-bind="$attrs"></aaa>
  </div>
</template>

<script>
import aaa from "@/views/componentTest/aaa";
export default {
  components:{
    aaa
  },
  props: {
    msgA: String,
    methodA: Function
  },
  data() {
    return {
      msgAA: '子传父'
    }
  },
  methods: {
    methodAA(){
      this.$emit("msgAA",this.msgAA)
    },
    methodAA2(){
      // this.$emit("methodA")
      // this.methodA()
      this.$parent.methodA();
    },
    methodAA3(){
      this.$message("我是子方法");
    },
  }
}
</script>

<style scoped>
.aa {
  width: 500px;
  height: 500px;
  background-color: #42b983;
}
</style>
